import 'package:flutter/material.dart';
import '../../core/elegance_theme.dart';

/// 骨架屏组件类型枚举
enum ESkeletonType {
  /// 文本类型
  text,
  
  /// 圆形类型（如头像）
  circle,
  
  /// 方形类型
  square,
}

/// 骨架屏组件
class ESkeleton extends StatelessWidget {
  /// 创建ESkeleton组件
  const ESkeleton({
    super.key,
    this.type = ESkeletonType.text,
    this.width,
    this.height,
    this.radius,
    this.count = 1,
    this.gap = 8,
    this.backgroundColor,
    this.animation = true,
  });

  /// 骨架屏类型
  final ESkeletonType type;
  
  /// 骨架屏宽度
  final double? width;
  
  /// 骨架屏高度
  final double? height;
  
  /// 骨架屏圆角
  final double? radius;
  
  /// 骨架屏数量
  final int count;
  
  /// 多个骨架屏之间的间距
  final double gap;
  
  /// 背景颜色
  final Color? backgroundColor;
  
  /// 是否显示动画效果
  final bool animation;
  
  @override
  Widget build(BuildContext context) {
    final theme = EleganceTheme.of(context);
    final bgColor = backgroundColor ?? theme.surfaceColor;
    final defaultRadius = radius ?? 4.0;
    
    // 构建单个骨架屏
    Widget buildSkeleton() {
      return Container(
        width: width,
        height: height ?? (type == ESkeletonType.text ? 18.0 : 40.0),
        decoration: BoxDecoration(
          color: bgColor,
          borderRadius: BorderRadius.circular(
            type == ESkeletonType.circle ? (height ?? 40.0) / 2 : defaultRadius,
          ),
        ),
      );
    }
    
    // 如果启用动画效果，则添加渐变动画
    Widget skeleton = buildSkeleton();
    if (animation) {
      skeleton = AnimatedSkeleton(
        backgroundColor: bgColor,
        child: skeleton,
      );
    }
    
    // 如果数量大于1，则创建多个骨架屏
    if (count > 1) {
      return Column(
        mainAxisSize: MainAxisSize.min,
        children: List.generate(
          count, 
          (index) => Container(
            margin: EdgeInsets.only(top: index > 0 ? gap : 0),
            child: skeleton,
          ),
        ),
      );
    }
    
    return skeleton;
  }
}

/// 带动画效果的骨架屏
class AnimatedSkeleton extends StatefulWidget {
  /// 创建AnimatedSkeleton组件
  const AnimatedSkeleton({
    super.key,
    this.backgroundColor,
    required this.child,
  });
  
  /// 背景颜色
  final Color? backgroundColor;
  
  /// 子组件
  final Widget child;
  
  @override
  AnimatedSkeletonState createState() => AnimatedSkeletonState();
}

class AnimatedSkeletonState extends State<AnimatedSkeleton> 
    with SingleTickerProviderStateMixin {
  late AnimationController _controller;
  late Animation<double> _opacityAnimation;
  
  @override
  void initState() {
    super.initState();
    
    // 创建动画控制器
    _controller = AnimationController(
      vsync: this,
      duration: const Duration(seconds: 1),
    );
    
    // 创建透明度动画
    _opacityAnimation = TweenSequence([
      TweenSequenceItem<double>(
        tween: Tween<double>(begin: 1.0, end: 0.6),
        weight: 1,
      ),
      TweenSequenceItem<double>(
        tween: Tween<double>(begin: 0.6, end: 1.0),
        weight: 1,
      ),
    ]).animate(CurvedAnimation(
      parent: _controller,
      curve: Curves.easeInOut,
    ));
    
    // 启动循环动画
    _controller.repeat();
  }
  
  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }
  
  @override
  Widget build(BuildContext context) {
    return AnimatedBuilder(
      animation: _opacityAnimation,
      builder: (context, child) {
        return Opacity(
          opacity: _opacityAnimation.value,
          child: child,
        );
      },
      child: widget.child,
    );
  }
}